<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <meta name="robots" content="noodp" />
        <meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1">
        <title>Theme Documentation - Basics | Ahhh.fun</title>
        <meta name="Description" content="Discover what the Hugo - LoveIt theme is all about and the core-concepts behind it."><meta property="og:title" content="Theme Documentation - Basics" />
<meta property="og:description" content="Discover what the Hugo - LoveIt theme is all about and the core-concepts behind it." />
<meta property="og:type" content="article" />
<meta property="og:url" content="https://ainy.gitee.io/en/theme-documentation-basics/" />
<meta property="article:published_time" content="2020-03-06T21:29:01+08:00" />
<meta property="article:modified_time" content="2020-04-19T21:19:34+08:00" /><meta property="og:site_name" content="Ahhh.fun" />
<meta name="twitter:card" content="summary"/>
<meta name="twitter:title" content="Theme Documentation - Basics"/>
<meta name="twitter:description" content="Discover what the Hugo - LoveIt theme is all about and the core-concepts behind it."/>
<meta name="theme-color" content="#ffffff">
<meta name="msapplication-TileColor" content="#da532c">
<link rel="canonical" href="https://ainy.gitee.io/en/theme-documentation-basics/" />
<link rel="shortcut icon" type="image/x-icon" href="https://ainy.gitee.io/favicon.ico" />
<link rel="apple-touch-icon" sizes="180x180" href="https://ainy.gitee.io/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="https://ainy.gitee.io/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="https://ainy.gitee.io/favicon-16x16.png">
<link rel="manifest" href="https://ainy.gitee.io/site.webmanifest">
<link rel="mask-icon" href="https://ainy.gitee.io/safari-pinned-tab.svg" color="#5bbad5"><link rel="prev" href="https://ainy.gitee.io/en/theme-documentation-content/" /><link rel="stylesheet" href="https://ainy.gitee.io/lib/fontawesome-free/all.min.css"><link rel="stylesheet" href="https://ainy.gitee.io/lib/animate/animate.min.css"><link rel="stylesheet" href="https://ainy.gitee.io/css/style.min.css"><script type="application/ld+json">
    {
        "@context": "http://schema.org",
        "@type": "BlogPosting",
        "headline": "Theme Documentation - Basics",
        "inLanguage": "en",
        "mainEntityOfPage": {
            "@type": "WebPage",
            "@id": "https:\/\/ainy.gitee.io\/en\/theme-documentation-basics\/"
        },"image": {
                "@type": "ImageObject",
                "url": "https:\/\/ainy.gitee.io\/cover.png",
                "width":  800 ,
                "height":  600 
            },"genre": "posts","keywords": "installation, configuration","wordcount":  2932 ,
        "url": "https:\/\/ainy.gitee.io\/en\/theme-documentation-basics\/","datePublished": "2020-03-06","dateModified": "2020-04-19","license": "This work is licensed under a Creative Commons Attribution-NonCommercial 4.0 International License.","publisher": {
                "@type": "Organization",
                "name": "Jie",
                "logo": {
                "@type": "ImageObject",
                "url": "https:\/\/ainy.gitee.io\/logo.png",
                "width":  127 ,
                "height":  40 
                }
            },"author": {
                "@type": "Person",
                "name": "Dillon"
            },"description": "Discover what the Hugo - LoveIt theme is all about and the core-concepts behind it."
    }
    </script></head>
    <body><script>
            if (!window.localStorage || !window.localStorage.getItem('theme')) {window.isDark = window.matchMedia('(prefers-color-scheme: dark)').matches;} else {
                window.isDark = (window.localStorage && window.localStorage.getItem('theme')) === 'dark';
            }
            window.isDark && document.body.classList.add('dark-theme');
        </script><div class="wrapper"><header class="desktop" id="header-desktop">
    <div class="header-wrapper">
        <div class="header-title">
            <a href="https://ainy.gitee.io/en/">Ahhh.fun</a>
        </div>
        <div class="menu"><a class="menu-item" href="https://ainy.gitee.io/en/posts/" rel="noopener noreffer">Posts</a><a class="menu-item" href="https://ainy.gitee.io/en/tags/" rel="noopener noreffer">Tags</a><a class="menu-item" href="https://ainy.gitee.io/en/categories/" rel="noopener noreffer">Categories</a><a class="menu-item" href="https://ainy.gitee.io/en/categories/documentation/" rel="noopener noreffer">Docs</a><a class="menu-item" href="https://ainy.gitee.io/en/about/" rel="noopener noreffer">About</a><a class="menu-item" href="https://gitee.com/ainy/ainy" title="GitHub" rel="noopener noreffer" target="_blank"><i class='fab fa-github fa-fw'></i></a><span class="menu-item">|</span>
            <a href="javascript:void(0);" class="menu-item theme-switch" title="Switch Theme">
                <i class="fas fa-adjust fa-fw"></i>
            </a><a href="javascript:void(0);" class="menu-item" title="Select Language">English<i class="fas fa-chevron-right fa-fw"></i>
                    <select class="language-select" id="language-select-desktop" onchange="location = this.value;"><option value="/en/theme-documentation-basics/" selected>English</option><option value="/theme-documentation-basics/">简体中文</option><option value="/fr/theme-documentation-basics/">Français</option></select>
                </a></div>
    </div>
</header><header class="mobile" id="header-mobile">
    <div class="header-wrapper">
        <div class="header-container">
            <div class="header-title">
                <a href="https://ainy.gitee.io/en/">Ahhh.fun</a>
            </div>
            <div class="menu-toggle" id="menu-toggle-mobile">
                <span></span><span></span><span></span>
            </div>
        </div>
        <div class="menu" id="menu-mobile"><a class="menu-item" href="https://ainy.gitee.io/en/posts/" title="" rel="noopener noreffer">Posts</a><a class="menu-item" href="https://ainy.gitee.io/en/tags/" title="" rel="noopener noreffer">Tags</a><a class="menu-item" href="https://ainy.gitee.io/en/categories/" title="" rel="noopener noreffer">Categories</a><a class="menu-item" href="https://ainy.gitee.io/en/categories/documentation/" title="" rel="noopener noreffer">Docs</a><a class="menu-item" href="https://ainy.gitee.io/en/about/" title="" rel="noopener noreffer">About</a><a class="menu-item" href="https://gitee.com/ainy/ainy" title="GitHub" rel="noopener noreffer" target="_blank"><i class='fab fa-github fa-fw'></i></a><a href="javascript:void(0);" class="menu-item theme-switch" title="Switch Theme">
                <i class="fas fa-adjust fa-fw"></i>
            </a><a href="javascript:void(0);" class="menu-item" title="Select Language">English<i class="fas fa-chevron-right fa-fw"></i>
                    <select class="language-select" onchange="location = this.value;"><option value="/en/theme-documentation-basics/" selected>English</option><option value="/theme-documentation-basics/">简体中文</option><option value="/fr/theme-documentation-basics/">Français</option></select>
                </a></div>
    </div>
</header>

<script>
    window.desktopHeaderMode = "fixed";
    window.mobileHeaderMode = "auto";
</script>
<main class="main">
                <div class="container"><article class="page single"><h1 class="single-title animated flipInX">Theme Documentation - Basics</h1><div class="post-meta">
            <div class="post-meta-line"><span class="post-author"><a href="https://dillonzq.com" title="Author" target="_blank" rel="noopener noreffer author" class="author"><i class="fas fa-user-circle fa-fw"></i>Dillon</a>
</span>&nbsp;
                    <span class="post-category">included in<a href="https://ainy.gitee.io/en/categories/documentation">
                                <i class="far fa-folder fa-fw"></i>Documentation
                            </a></span></div>
            <div class="post-meta-line"><i class="far fa-calendar-alt fa-fw"></i><time datetime=2020-03-06>2020-03-06</time>&nbsp;
                <i class="fas fa-pencil-alt fa-fw"></i>about 2932 words&nbsp;
                <i class="far fa-clock fa-fw"></i>14 min&nbsp;<span id="/en/theme-documentation-basics/" class="leancloud_visitors" data-flag-title="Theme Documentation - Basics">
                        <i class="far fa-eye fa-fw"></i><span class=leancloud-visitors-count></span>&nbsp;views
                    </span>&nbsp;</div>
        </div><div class="featured-image"><img
        class="lazyload"
        src="https://ainy.gitee.io/svg/loading.min.svg"
        data-sizes="auto"
        data-srcset="https://ainy.gitee.io/images/theme-documentation-basics/featured-image.jpg, https://ainy.gitee.io/images/theme-documentation-basics/featured-image.jpg 1.5x, https://ainy.gitee.io/images/theme-documentation-basics/featured-image.jpg 2x"
        data-src="https://ainy.gitee.io/images/theme-documentation-basics/featured-image.jpg"
        alt="Discover what the Hugo - LoveIt theme is all about and the core-concepts behind it."
        title="Discover what the Hugo - LoveIt theme is all about and the core-concepts behind it." /></div><div class="toc" id="toc-auto">
                <h2 class="toc-title">Contents</h2>
                <div class="toc-content always-active" id="toc-content-auto"></div>
            </div>
            <div class="toc" id="toc-static">
                <details>
                    <summary>
                        <div class="toc-title">
                            <span>Contents</span>
                            <span><i class="details icon fas fa-angle-down"></i></span>
                        </div>
                    </summary>
                    <div class="toc-content" id="toc-content-static"><nav id="TableOfContents">
  <ul>
    <li><a href="#1-requirements">1 Requirements</a></li>
    <li><a href="#2-installation">2 Installation</a>
      <ul>
        <li><a href="#21-create-your-project">2.1 Create Your Project</a></li>
        <li><a href="#22-install-the-theme">2.2 Install the Theme</a></li>
        <li><a href="#basic-configuration">2.3 Basic Configuration</a></li>
        <li><a href="#24-create-your-first-post">2.4 Create Your First Post</a></li>
        <li><a href="#25-launching-the-website-locally">2.5 Launching the Website Locally</a></li>
        <li><a href="#26-build-the-website">2.6 Build the Website</a></li>
      </ul>
    </li>
    <li><a href="#3-configuration">3 Configuration</a>
      <ul>
        <li><a href="#site-configuration">3.1 Site Configuration</a></li>
        <li><a href="#32-favicons-browserconfig-manifest">3.2 Favicons, Browserconfig, Manifest</a></li>
        <li><a href="#33-add-logo-and-cover-for-seo">3.3 Add Logo and Cover for SEO</a></li>
        <li><a href="#34-style-customization">3.4 Style Customization</a></li>
      </ul>
    </li>
    <li><a href="#4-multilingual-and-i18n">4 Multilingual and i18n</a>
      <ul>
        <li><a href="#41-basic-configuration">4.1 Basic Configuration</a></li>
        <li><a href="#42-overwrite-translation-strings">4.2 Overwrite Translation Strings</a></li>
      </ul>
    </li>
  </ul>
</nav></div>
                </details>
            </div><div class="content" id="content"><p>Discover what the Hugo - <strong>LoveIt</strong> theme is all about and the core-concepts behind it.</p>
<h2 id="1-requirements">1 Requirements</h2>
<p>Thanks to the simplicity of Hugo, <a href="https://gohugo.io/" target="_blank" rel="noopener noreffer">Hugo</a>
 is the only dependency of this theme.</p>
<p>Just install latest version of <a href="https://gohugo.io/getting-started/installing/" target="_blank" rel="noopener noreffer"><i class="far fa-file-archive fa-fw"></i> Hugo (&gt; 0.62.0)</a>
 for your OS (<strong>Windows</strong>, <strong>Linux</strong>, <strong>macOS</strong>).</p>
<div class="admonition note">
            <p class="admonition-title"><i class="icon fas fa-pencil-alt"></i>Why not support earlier versions of Hugo?</p>
            <div class="admonition-content">Since <a href="https://gohugo.io/getting-started/configuration-markup/#markdown-render-hooks" target="_blank" rel="noopener noreffer">Markdown Render Hooks</a>
 was introduced in the <a href="https://gohugo.io/news/0.62.0-relnotes/" target="_blank" rel="noopener noreffer">Hugo Christmas Edition</a>
, this theme only supports Hugo versions above <strong>v0.62.0</strong>.</div>
        </div>
<h2 id="2-installation">2 Installation</h2>
<p>The following steps are here to help you initialize your new website. If you don’t know Hugo at all, we strongly suggest you learn more about it by following this <a href="https://gohugo.io/getting-started/quick-start/" target="_blank" rel="noopener noreffer">great documentation for beginners</a>
.</p>
<h3 id="21-create-your-project">2.1 Create Your Project</h3>
<p>Hugo provides a <code>new</code> command to create a new website:</p>
<div class="highlight"><div class="chroma">
<table class="lntable"><tr><td class="lntd">
<pre class="chroma"><code><span class="lnt">1
</span><span class="lnt">2
</span></code></pre></td>
<td class="lntd">
<pre class="chroma"><code class="language-bash" data-lang="bash">hugo new site my_website
<span class="nb">cd</span> my_website
</code></pre></td></tr></table>
</div>
</div><h3 id="22-install-the-theme">2.2 Install the Theme</h3>
<p>The <strong>LoveIt</strong> theme’s repository is: <a href="https://github.com/dillonzq/LoveIt" target="_blank" rel="noopener noreffer">https://github.com/dillonzq/LoveIt</a>
.</p>
<p>You can download the <a href="https://github.com/dillonzq/LoveIt/releases" target="_blank" rel="noopener noreffer">latest release <i class="far fa-file-archive fa-fw"></i> .zip file</a>
 of the theme and extract it in the <code>themes</code> directory.</p>
<p>Alternatively, clone this repository to the <code>themes</code> directory:</p>
<div class="highlight"><div class="chroma">
<table class="lntable"><tr><td class="lntd">
<pre class="chroma"><code><span class="lnt">1
</span></code></pre></td>
<td class="lntd">
<pre class="chroma"><code class="language-bash" data-lang="bash">git clone -b master https://github.com/dillonzq/LoveIt.git themes/LoveIt
</code></pre></td></tr></table>
</div>
</div><p>Or, create an empty git repository and make this repository a submodule of your site directory:</p>
<div class="highlight"><div class="chroma">
<table class="lntable"><tr><td class="lntd">
<pre class="chroma"><code><span class="lnt">1
</span><span class="lnt">2
</span></code></pre></td>
<td class="lntd">
<pre class="chroma"><code class="language-bash" data-lang="bash">git init
git submodule -b master add https://github.com/dillonzq/LoveIt.git themes/LoveIt
</code></pre></td></tr></table>
</div>
</div><h3 id="basic-configuration">2.3 Basic Configuration</h3>
<p>The following is a basic configuration for the LoveIt theme:</p>
<div class="highlight"><div class="chroma">
<table class="lntable"><tr><td class="lntd">
<pre class="chroma"><code><span class="lnt"> 1
</span><span class="lnt"> 2
</span><span class="lnt"> 3
</span><span class="lnt"> 4
</span><span class="lnt"> 5
</span><span class="lnt"> 6
</span><span class="lnt"> 7
</span><span class="lnt"> 8
</span><span class="lnt"> 9
</span><span class="lnt">10
</span><span class="lnt">11
</span><span class="lnt">12
</span><span class="lnt">13
</span><span class="lnt">14
</span><span class="lnt">15
</span><span class="lnt">16
</span><span class="lnt">17
</span><span class="lnt">18
</span><span class="lnt">19
</span><span class="lnt">20
</span><span class="lnt">21
</span><span class="lnt">22
</span><span class="lnt">23
</span><span class="lnt">24
</span><span class="lnt">25
</span><span class="lnt">26
</span><span class="lnt">27
</span><span class="lnt">28
</span><span class="lnt">29
</span><span class="lnt">30
</span><span class="lnt">31
</span><span class="lnt">32
</span><span class="lnt">33
</span><span class="lnt">34
</span><span class="lnt">35
</span><span class="lnt">36
</span><span class="lnt">37
</span><span class="lnt">38
</span></code></pre></td>
<td class="lntd">
<pre class="chroma"><code class="language-toml" data-lang="toml"><span class="nx">baseURL</span> <span class="p">=</span> <span class="s2">&#34;http://example.org/&#34;</span>
<span class="c"># [en, zh-cn, fr, ...] determines default content language</span>
<span class="nx">defaultContentLanguage</span> <span class="p">=</span> <span class="s2">&#34;en&#34;</span>
<span class="c"># language code</span>
<span class="nx">languageCode</span> <span class="p">=</span> <span class="s2">&#34;en&#34;</span>
<span class="nx">title</span> <span class="p">=</span> <span class="s2">&#34;My New Hugo Site&#34;</span>

<span class="c"># Change the default theme to be use when building the site with Hugo</span>
<span class="nx">theme</span> <span class="p">=</span> <span class="s2">&#34;LoveIt&#34;</span>

<span class="p">[</span><span class="nx">params</span><span class="p">]</span>
  <span class="c"># LoveIt theme version</span>
  <span class="nx">version</span> <span class="p">=</span> <span class="s2">&#34;0.1.X&#34;</span>

<span class="p">[</span><span class="nx">menu</span><span class="p">]</span>
  <span class="p">[[</span><span class="nx">menu</span><span class="p">.</span><span class="nx">main</span><span class="p">]]</span>
    <span class="nx">identifier</span> <span class="p">=</span> <span class="s2">&#34;posts&#34;</span>
    <span class="c"># you can add extra information before the name (HTML format is allowed), such as icons</span>
    <span class="nx">pre</span> <span class="p">=</span> <span class="s2">&#34;&#34;</span>
    <span class="nx">name</span> <span class="p">=</span> <span class="s2">&#34;Posts&#34;</span>
    <span class="nx">url</span> <span class="p">=</span> <span class="s2">&#34;/posts/&#34;</span>
    <span class="c"># title will be shown when you hover on this menu link</span>
    <span class="nx">title</span> <span class="p">=</span> <span class="s2">&#34;&#34;</span>
    <span class="nx">weight</span> <span class="p">=</span> <span class="mi">1</span>
  <span class="p">[[</span><span class="nx">menu</span><span class="p">.</span><span class="nx">main</span><span class="p">]]</span>
    <span class="nx">identifier</span> <span class="p">=</span> <span class="s2">&#34;tags&#34;</span>
    <span class="nx">pre</span> <span class="p">=</span> <span class="s2">&#34;&#34;</span>
    <span class="nx">name</span> <span class="p">=</span> <span class="s2">&#34;Tags&#34;</span>
    <span class="nx">url</span> <span class="p">=</span> <span class="s2">&#34;/tags/&#34;</span>
    <span class="nx">title</span> <span class="p">=</span> <span class="s2">&#34;&#34;</span>
    <span class="nx">weight</span> <span class="p">=</span> <span class="mi">2</span>
  <span class="p">[[</span><span class="nx">menu</span><span class="p">.</span><span class="nx">main</span><span class="p">]]</span>
    <span class="nx">identifier</span> <span class="p">=</span> <span class="s2">&#34;categories&#34;</span>
    <span class="nx">pre</span> <span class="p">=</span> <span class="s2">&#34;&#34;</span>
    <span class="nx">name</span> <span class="p">=</span> <span class="s2">&#34;Categories&#34;</span>
    <span class="nx">url</span> <span class="p">=</span> <span class="s2">&#34;/categories/&#34;</span>
    <span class="nx">title</span> <span class="p">=</span> <span class="s2">&#34;&#34;</span>
    <span class="nx">weight</span> <span class="p">=</span> <span class="mi">3</span>
</code></pre></td></tr></table>
</div>
</div><div class="admonition note">
            <p class="admonition-title"><i class="icon fas fa-pencil-alt"></i>Note</p>
            <div class="admonition-content">When building the website, you can set a theme by using <code>--theme</code> option. However, we suggest you modify the configuration file (<strong>config.toml</strong>) and set the theme as the default.</div>
        </div>
<h3 id="24-create-your-first-post">2.4 Create Your First Post</h3>
<p>Here is the way to create your first post:</p>
<div class="highlight"><div class="chroma">
<table class="lntable"><tr><td class="lntd">
<pre class="chroma"><code><span class="lnt">1
</span></code></pre></td>
<td class="lntd">
<pre class="chroma"><code class="language-bash" data-lang="bash">hugo new posts/first_post.md
</code></pre></td></tr></table>
</div>
</div><p>Feel free to edit the post file by adding some sample content and replacing the title value in the beginning of the file.</p>
<div class="admonition note">
            <p class="admonition-title"><i class="icon fas fa-pencil-alt"></i>Note</p>
            <div class="admonition-content">By default all posts and pages are created as a draft. If you want to render these pages, remove the property <code>draft: true</code> from the metadata or set the property <code>draft: false</code>.</div>
        </div>
<h3 id="25-launching-the-website-locally">2.5 Launching the Website Locally</h3>
<p>Launch by using the following command:</p>
<div class="highlight"><div class="chroma">
<table class="lntable"><tr><td class="lntd">
<pre class="chroma"><code><span class="lnt">1
</span></code></pre></td>
<td class="lntd">
<pre class="chroma"><code class="language-bash" data-lang="bash">hugo serve
</code></pre></td></tr></table>
</div>
</div><p>Go to <code>http://localhost:1313</code>.</p>
<p><figure><a class="lightgallery" href="https://ainy.gitee.io/images/theme-documentation-basics/basic-configuration-preview.png" title="Basic configuration preview" data-thumbnail="/images/theme-documentation-basics/basic-configuration-preview.png" data-sub-html="<h2>Basic configuration preview</h2><p>Basic configuration preview</p>">
        <img
            class="lazyload"
            src="https://ainy.gitee.io/svg/loading.min.svg"
            data-sizes="auto"
            data-srcset="https://ainy.gitee.io/images/theme-documentation-basics/basic-configuration-preview.png, https://ainy.gitee.io/images/theme-documentation-basics/basic-configuration-preview.png 1.5x, https://ainy.gitee.io/images/theme-documentation-basics/basic-configuration-preview.png 2x"
            data-src="https://ainy.gitee.io/images/theme-documentation-basics/basic-configuration-preview.png"
            alt="Basic configuration preview" />
    </a><figcaption class="image-caption">Basic configuration preview</figcaption>
    </figure></p>
<div class="admonition tip">
            <p class="admonition-title"><i class="icon fas fa-lightbulb"></i>Tip</p>
            <div class="admonition-content">When you run <code>hugo serve</code>, when the contents of the files change, the page automatically refreshes with the changes.</div>
        </div>
<h3 id="26-build-the-website">2.6 Build the Website</h3>
<p>When your site is ready to deploy, run the following command:</p>
<div class="highlight"><div class="chroma">
<table class="lntable"><tr><td class="lntd">
<pre class="chroma"><code><span class="lnt">1
</span></code></pre></td>
<td class="lntd">
<pre class="chroma"><code class="language-bash" data-lang="bash">hugo
</code></pre></td></tr></table>
</div>
</div><p>A <code>public</code> folder will be generated, containing all static content and assets for your website. It can now be deployed on any web server.</p>
<div class="admonition tip">
            <p class="admonition-title"><i class="icon fas fa-lightbulb"></i>Tip</p>
            <div class="admonition-content">The website can be automatically published and hosted with <a href="https://www.netlify.com/" target="_blank" rel="noopener noreffer">Netlify</a>
 (Read more about <a href="https://www.netlify.com/blog/2015/07/30/hosting-hugo-on-netlifyinsanely-fast-deploys/" target="_blank" rel="noopener noreffer">Automated HUGO deployments with Netlify</a>
).
Alternatively, you can use <a href="https://gohugo.io/hosting-and-deployment/hosting-on-aws-amplify/" target="_blank" rel="noopener noreffer">AWS Amplify</a>
, <a href="https://gohugo.io/hosting-and-deployment/hosting-on-github/" target="_blank" rel="noopener noreffer">Github pages</a>
, <a href="https://gohugo.io/hosting-and-deployment/hosting-on-render/" target="_blank" rel="noopener noreffer">Render</a>
 and more&hellip;</div>
        </div>
<h2 id="3-configuration">3 Configuration</h2>
<h3 id="site-configuration">3.1 Site Configuration</h3>
<p>In addition to <a href="https://gohugo.io/overview/configuration/" target="_blank" rel="noopener noreffer">Hugo global configuration</a>
 and <a href="#basic-configuration" rel="noopener noreffer">menu configuration</a>
, <strong>LoveIt</strong> lets you define the following parameters in your site configuration (here is a <code>config.toml</code>, whose values are default).</p>
<div class="admonition note">
            <p class="admonition-title"><i class="icon fas fa-pencil-alt"></i>Note</p>
            <div class="admonition-content">Note that some of these parameters are explained in details in other sections of this documentation.</div>
        </div>
<div class="highlight"><div class="chroma">
<table class="lntable"><tr><td class="lntd">
<pre class="chroma"><code><span class="lnt">  1
</span><span class="lnt">  2
</span><span class="lnt">  3
</span><span class="lnt">  4
</span><span class="lnt">  5
</span><span class="lnt">  6
</span><span class="lnt">  7
</span><span class="lnt">  8
</span><span class="lnt">  9
</span><span class="lnt"> 10
</span><span class="lnt"> 11
</span><span class="lnt"> 12
</span><span class="lnt"> 13
</span><span class="lnt"> 14
</span><span class="lnt"> 15
</span><span class="lnt"> 16
</span><span class="lnt"> 17
</span><span class="lnt"> 18
</span><span class="lnt"> 19
</span><span class="lnt"> 20
</span><span class="lnt"> 21
</span><span class="lnt"> 22
</span><span class="lnt"> 23
</span><span class="lnt"> 24
</span><span class="lnt"> 25
</span><span class="lnt"> 26
</span><span class="lnt"> 27
</span><span class="lnt"> 28
</span><span class="lnt"> 29
</span><span class="lnt"> 30
</span><span class="lnt"> 31
</span><span class="lnt"> 32
</span><span class="lnt"> 33
</span><span class="lnt"> 34
</span><span class="lnt"> 35
</span><span class="lnt"> 36
</span><span class="lnt"> 37
</span><span class="lnt"> 38
</span><span class="lnt"> 39
</span><span class="lnt"> 40
</span><span class="lnt"> 41
</span><span class="lnt"> 42
</span><span class="lnt"> 43
</span><span class="lnt"> 44
</span><span class="lnt"> 45
</span><span class="lnt"> 46
</span><span class="lnt"> 47
</span><span class="lnt"> 48
</span><span class="lnt"> 49
</span><span class="lnt"> 50
</span><span class="lnt"> 51
</span><span class="lnt"> 52
</span><span class="lnt"> 53
</span><span class="lnt"> 54
</span><span class="lnt"> 55
</span><span class="lnt"> 56
</span><span class="lnt"> 57
</span><span class="lnt"> 58
</span><span class="lnt"> 59
</span><span class="lnt"> 60
</span><span class="lnt"> 61
</span><span class="lnt"> 62
</span><span class="lnt"> 63
</span><span class="lnt"> 64
</span><span class="lnt"> 65
</span><span class="lnt"> 66
</span><span class="lnt"> 67
</span><span class="lnt"> 68
</span><span class="lnt"> 69
</span><span class="lnt"> 70
</span><span class="lnt"> 71
</span><span class="lnt"> 72
</span><span class="lnt"> 73
</span><span class="lnt"> 74
</span><span class="lnt"> 75
</span><span class="lnt"> 76
</span><span class="lnt"> 77
</span><span class="lnt"> 78
</span><span class="lnt"> 79
</span><span class="lnt"> 80
</span><span class="lnt"> 81
</span><span class="lnt"> 82
</span><span class="lnt"> 83
</span><span class="lnt"> 84
</span><span class="lnt"> 85
</span><span class="lnt"> 86
</span><span class="lnt"> 87
</span><span class="lnt"> 88
</span><span class="lnt"> 89
</span><span class="lnt"> 90
</span><span class="lnt"> 91
</span><span class="lnt"> 92
</span><span class="lnt"> 93
</span><span class="lnt"> 94
</span><span class="lnt"> 95
</span><span class="lnt"> 96
</span><span class="lnt"> 97
</span><span class="lnt"> 98
</span><span class="lnt"> 99
</span><span class="lnt">100
</span><span class="lnt">101
</span><span class="lnt">102
</span><span class="lnt">103
</span><span class="lnt">104
</span><span class="lnt">105
</span><span class="lnt">106
</span><span class="lnt">107
</span><span class="lnt">108
</span><span class="lnt">109
</span><span class="lnt">110
</span><span class="lnt">111
</span><span class="lnt">112
</span><span class="lnt">113
</span><span class="lnt">114
</span><span class="lnt">115
</span><span class="lnt">116
</span><span class="lnt">117
</span><span class="lnt">118
</span><span class="lnt">119
</span><span class="lnt">120
</span><span class="lnt">121
</span><span class="lnt">122
</span><span class="lnt">123
</span><span class="lnt">124
</span><span class="lnt">125
</span><span class="lnt">126
</span><span class="lnt">127
</span><span class="lnt">128
</span><span class="lnt">129
</span><span class="lnt">130
</span><span class="lnt">131
</span><span class="lnt">132
</span><span class="lnt">133
</span><span class="lnt">134
</span><span class="lnt">135
</span><span class="lnt">136
</span><span class="lnt">137
</span><span class="lnt">138
</span><span class="lnt">139
</span><span class="lnt">140
</span><span class="lnt">141
</span><span class="lnt">142
</span><span class="lnt">143
</span><span class="lnt">144
</span><span class="lnt">145
</span><span class="lnt">146
</span><span class="lnt">147
</span><span class="lnt">148
</span><span class="lnt">149
</span><span class="lnt">150
</span><span class="lnt">151
</span><span class="lnt">152
</span><span class="lnt">153
</span><span class="lnt">154
</span><span class="lnt">155
</span><span class="lnt">156
</span><span class="lnt">157
</span><span class="lnt">158
</span><span class="lnt">159
</span><span class="lnt">160
</span><span class="lnt">161
</span><span class="lnt">162
</span><span class="lnt">163
</span><span class="lnt">164
</span><span class="lnt">165
</span><span class="lnt">166
</span><span class="lnt">167
</span><span class="lnt">168
</span><span class="lnt">169
</span><span class="lnt">170
</span><span class="lnt">171
</span><span class="lnt">172
</span><span class="lnt">173
</span><span class="lnt">174
</span><span class="lnt">175
</span><span class="lnt">176
</span><span class="lnt">177
</span><span class="lnt">178
</span><span class="lnt">179
</span><span class="lnt">180
</span><span class="lnt">181
</span><span class="lnt">182
</span><span class="lnt">183
</span><span class="lnt">184
</span><span class="lnt">185
</span><span class="lnt">186
</span><span class="lnt">187
</span><span class="lnt">188
</span><span class="lnt">189
</span><span class="lnt">190
</span><span class="lnt">191
</span><span class="lnt">192
</span><span class="lnt">193
</span><span class="lnt">194
</span><span class="lnt">195
</span><span class="lnt">196
</span><span class="lnt">197
</span><span class="lnt">198
</span><span class="lnt">199
</span><span class="lnt">200
</span><span class="lnt">201
</span><span class="lnt">202
</span><span class="lnt">203
</span><span class="lnt">204
</span><span class="lnt">205
</span><span class="lnt">206
</span><span class="lnt">207
</span><span class="lnt">208
</span><span class="lnt">209
</span><span class="lnt">210
</span><span class="lnt">211
</span><span class="lnt">212
</span><span class="lnt">213
</span><span class="lnt">214
</span><span class="lnt">215
</span><span class="lnt">216
</span><span class="lnt">217
</span><span class="lnt">218
</span><span class="lnt">219
</span><span class="lnt">220
</span><span class="lnt">221
</span><span class="lnt">222
</span><span class="lnt">223
</span><span class="lnt">224
</span><span class="lnt">225
</span><span class="lnt">226
</span><span class="lnt">227
</span><span class="lnt">228
</span><span class="lnt">229
</span><span class="lnt">230
</span><span class="lnt">231
</span><span class="lnt">232
</span><span class="lnt">233
</span><span class="lnt">234
</span><span class="lnt">235
</span><span class="lnt">236
</span><span class="lnt">237
</span><span class="lnt">238
</span><span class="lnt">239
</span><span class="lnt">240
</span><span class="lnt">241
</span><span class="lnt">242
</span><span class="lnt">243
</span><span class="lnt">244
</span><span class="lnt">245
</span><span class="lnt">246
</span><span class="lnt">247
</span><span class="lnt">248
</span><span class="lnt">249
</span><span class="lnt">250
</span><span class="lnt">251
</span><span class="lnt">252
</span><span class="lnt">253
</span><span class="lnt">254
</span><span class="lnt">255
</span><span class="lnt">256
</span><span class="lnt">257
</span><span class="lnt">258
</span><span class="lnt">259
</span><span class="lnt">260
</span><span class="lnt">261
</span><span class="lnt">262
</span><span class="lnt">263
</span><span class="lnt">264
</span><span class="lnt">265
</span><span class="lnt">266
</span><span class="lnt">267
</span><span class="lnt">268
</span><span class="lnt">269
</span><span class="lnt">270
</span><span class="lnt">271
</span><span class="lnt">272
</span><span class="lnt">273
</span><span class="lnt">274
</span><span class="lnt">275
</span><span class="lnt">276
</span><span class="lnt">277
</span><span class="lnt">278
</span><span class="lnt">279
</span><span class="lnt">280
</span><span class="lnt">281
</span><span class="lnt">282
</span><span class="lnt">283
</span><span class="lnt">284
</span><span class="lnt">285
</span><span class="lnt">286
</span><span class="lnt">287
</span><span class="lnt">288
</span><span class="lnt">289
</span><span class="lnt">290
</span><span class="lnt">291
</span><span class="lnt">292
</span><span class="lnt">293
</span><span class="lnt">294
</span><span class="lnt">295
</span><span class="lnt">296
</span><span class="lnt">297
</span><span class="lnt">298
</span><span class="lnt">299
</span><span class="lnt">300
</span><span class="lnt">301
</span><span class="lnt">302
</span><span class="lnt">303
</span><span class="lnt">304
</span><span class="lnt">305
</span><span class="lnt">306
</span><span class="lnt">307
</span><span class="lnt">308
</span><span class="lnt">309
</span><span class="lnt">310
</span><span class="lnt">311
</span><span class="lnt">312
</span><span class="lnt">313
</span><span class="lnt">314
</span><span class="lnt">315
</span><span class="lnt">316
</span><span class="lnt">317
</span><span class="lnt">318
</span><span class="lnt">319
</span><span class="lnt">320
</span><span class="lnt">321
</span><span class="lnt">322
</span><span class="lnt">323
</span><span class="lnt">324
</span><span class="lnt">325
</span><span class="lnt">326
</span><span class="lnt">327
</span><span class="lnt">328
</span><span class="lnt">329
</span><span class="lnt">330
</span><span class="lnt">331
</span><span class="lnt">332
</span><span class="lnt">333
</span><span class="lnt">334
</span><span class="lnt">335
</span><span class="lnt">336
</span><span class="lnt">337
</span><span class="lnt">338
</span><span class="lnt">339
</span><span class="lnt">340
</span><span class="lnt">341
</span><span class="lnt">342
</span><span class="lnt">343
</span></code></pre></td>
<td class="lntd">
<pre class="chroma"><code class="language-toml" data-lang="toml"><span class="p">[</span><span class="nx">params</span><span class="p">]</span>
  <span class="c"># LoveIt theme version</span>
  <span class="nx">version</span> <span class="p">=</span> <span class="s2">&#34;0.1.X&#34;</span>
  <span class="c"># site description</span>
  <span class="nx">description</span> <span class="p">=</span> <span class="s2">&#34;This is My New Hugo Site&#34;</span>
  <span class="c"># site keywords</span>
  <span class="nx">keywords</span> <span class="p">=</span> <span class="p">[</span><span class="s2">&#34;Theme&#34;</span><span class="p">,</span> <span class="s2">&#34;Hugo&#34;</span><span class="p">]</span>
  <span class="c"># site default theme (&#34;light&#34;, &#34;dark&#34;, &#34;auto&#34;)</span>
  <span class="nx">defaultTheme</span> <span class="p">=</span> <span class="s2">&#34;auto&#34;</span>
  <span class="c"># public git repo url only then enableGitInfo is true</span>
  <span class="nx">gitRepo</span> <span class="p">=</span> <span class="s2">&#34;&#34;</span>
  <span class="c"># LoveIt <i class="fas fa-greater-than-equal fa-fw"></i> <i class="far fa-file-archive fa-fw"></i> v0.1.1</span>
  <span class="c"># which hash function used for SRI, when empty, no SRI is used (&#34;sha256&#34;, &#34;sha384&#34;, &#34;sha512&#34;, &#34;md5&#34;)</span>
  <span class="nx">fingerprint</span> <span class="p">=</span> <span class="s2">&#34;&#34;</span>
  <span class="c"># Header info</span>
  <span class="p">[</span><span class="nx">params</span><span class="p">.</span><span class="nx">header</span><span class="p">]</span>
    <span class="c"># desktop header mode (&#34;fixed&#34;, &#34;normal&#34;, &#34;auto&#34;)</span>
    <span class="nx">desktopMode</span> <span class="p">=</span> <span class="s2">&#34;fixed&#34;</span>
    <span class="c"># mobile header mode (&#34;fixed&#34;, &#34;normal&#34;, &#34;auto&#34;)</span>
    <span class="nx">mobileMode</span> <span class="p">=</span> <span class="s2">&#34;auto&#34;</span>
  <span class="c"># Footer Copyright Info</span>
  <span class="p">[</span><span class="nx">params</span><span class="p">.</span><span class="nx">footer</span><span class="p">]</span>
    <span class="c"># Site creation time</span>
    <span class="nx">since</span> <span class="p">=</span> <span class="mi">2019</span>
    <span class="c"># ICP info only in China (HTML format is allowed)</span>
    <span class="nx">icp</span> <span class="p">=</span> <span class="s2">&#34;&#34;</span>
    <span class="c"># license info (HTML format is allowed)</span>
    <span class="nx">license</span><span class="p">=</span> <span class="s1">&#39;&lt;a rel=&#34;license external nofollow noopener noreffer&#34; href=&#34;https://creativecommons.org/licenses/by-nc/4.0/&#34; target=&#34;_blank&#34;&gt;CC BY-NC 4.0&lt;/a&gt;&#39;</span>
  <span class="c"># Home Page Info</span>
  <span class="p">[</span><span class="nx">params</span><span class="p">.</span><span class="nx">home</span><span class="p">]</span>
    <span class="c"># Home Page Profile</span>
    <span class="p">[</span><span class="nx">params</span><span class="p">.</span><span class="nx">home</span><span class="p">.</span><span class="nx">profile</span><span class="p">]</span>
      <span class="nx">enable</span> <span class="p">=</span> <span class="kc">true</span>
      <span class="c"># Gravatar Email for preferred avatar in home page</span>
      <span class="nx">gravatarEmail</span> <span class="p">=</span> <span class="s2">&#34;&#34;</span>
      <span class="c"># URL of avatar shown in home page</span>
      <span class="nx">avatarURL</span> <span class="p">=</span> <span class="s2">&#34;/images/avatar.png&#34;</span>
      <span class="c"># subtitle shown in home page</span>
      <span class="nx">subtitle</span> <span class="p">=</span> <span class="s2">&#34;This is My New Hugo Site&#34;</span>
      <span class="c"># whether to use typeit animation for subtitle</span>
      <span class="nx">typeit</span> <span class="p">=</span> <span class="kc">true</span>
      <span class="c"># whether to show social links</span>
      <span class="nx">social</span> <span class="p">=</span> <span class="kc">true</span>
    <span class="c"># Home Page Posts</span>
    <span class="p">[</span><span class="nx">params</span><span class="p">.</span><span class="nx">home</span><span class="p">.</span><span class="nx">posts</span><span class="p">]</span>
      <span class="nx">enable</span> <span class="p">=</span> <span class="kc">true</span>
      <span class="c"># special amount of posts in each home posts page</span>
      <span class="nx">paginate</span> <span class="p">=</span> <span class="mi">6</span>
      <span class="c"># default behavior when you don&#39;t set &#34;hiddenFromHomePage&#34; in front matter</span>
      <span class="nx">defaultHiddenFromHomePage</span> <span class="p">=</span> <span class="kc">false</span>
  <span class="c"># Social Info in home page</span>
  <span class="p">[</span><span class="nx">params</span><span class="p">.</span><span class="nx">social</span><span class="p">]</span>
    <span class="nx">GitHub</span> <span class="p">=</span> <span class="s2">&#34;xxxx&#34;</span>
    <span class="nx">Linkedin</span> <span class="p">=</span> <span class="s2">&#34;xxxx&#34;</span>
    <span class="nx">Twitter</span> <span class="p">=</span> <span class="s2">&#34;xxxx&#34;</span>
    <span class="nx">Instagram</span> <span class="p">=</span> <span class="s2">&#34;xxxx&#34;</span>
    <span class="nx">Email</span> <span class="p">=</span> <span class="s2">&#34;xxxx@xxxx.com&#34;</span>
    <span class="nx">Facebook</span> <span class="p">=</span> <span class="s2">&#34;xxxx&#34;</span>
    <span class="nx">Telegram</span> <span class="p">=</span> <span class="s2">&#34;xxxx&#34;</span>
    <span class="c"># Medium = &#34;xxxx&#34;</span>
    <span class="c"># Gitlab = &#34;xxxx&#34;</span>
    <span class="nx">Youtubelegacy</span> <span class="p">=</span> <span class="s2">&#34;xxxx&#34;</span>
    <span class="c"># Youtubecustom = &#34;xxxx&#34;</span>
    <span class="c"># Youtubechannel = &#34;xxxx&#34;</span>
    <span class="c"># Tumblr =&#34;xxxx&#34;</span>
    <span class="c"># Quora = &#34;xxxx&#34;</span>
    <span class="c"># Keybase = &#34;xxxx&#34;</span>
    <span class="c"># Pinterest = &#34;xxxx&#34;</span>
    <span class="c"># Reddit = &#34;xxxx&#34;</span>
    <span class="c"># Codepen = &#34;xxxx&#34;</span>
    <span class="c"># FreeCodeCamp = &#34;xxxx&#34;</span>
    <span class="c"># Bitbucket = &#34;xxxx&#34;</span>
    <span class="c"># Stackoverflow = &#34;xxxx&#34;</span>
    <span class="c"># Weibo = &#34;xxxx&#34;</span>
    <span class="c"># Odnoklassniki = &#34;xxxx&#34;</span>
    <span class="c"># VK = &#34;xxxx&#34;</span>
    <span class="c"># Flickr = &#34;xxxx&#34;</span>
    <span class="c"># Xing = &#34;xxxx&#34;</span>
    <span class="c"># Snapchat = &#34;xxxx&#34;</span>
    <span class="c"># Soundcloud = &#34;xxxx&#34;</span>
    <span class="c"># Spotify = &#34;xxxx&#34;</span>
    <span class="c"># Bandcamp = &#34;xxxx&#34;</span>
    <span class="c"># Paypal = &#34;xxxx&#34;</span>
    <span class="c"># Fivehundredpx = &#34;xxxx&#34;</span>
    <span class="c"># Mix = &#34;xxxx&#34;</span>
    <span class="c"># Goodreads = &#34;xxxx&#34;</span>
    <span class="c"># Lastfm = &#34;xxxx&#34;</span>
    <span class="c"># Foursquare = &#34;xxxx&#34;</span>
    <span class="c"># Hackernews = &#34;xxxx&#34;</span>
    <span class="c"># Kickstarter = &#34;xxxx&#34;</span>
    <span class="c"># Patreon = &#34;xxxx&#34;</span>
    <span class="c"># Steam = &#34;xxxx&#34;</span>
    <span class="c"># Twitch = &#34;xxxx&#34;</span>
    <span class="c"># Strava = &#34;xxxx&#34;</span>
    <span class="c"># Skype = &#34;xxxx&#34;</span>
    <span class="c"># Whatsapp = &#34;xxxx&#34;</span>
    <span class="c"># Zhihu = &#34;xxxx&#34;</span>
    <span class="c"># Douban = &#34;xxxx&#34;</span>
    <span class="c"># Angellist = &#34;xxxx&#34;</span>
    <span class="c"># Slidershare = &#34;xxxx&#34;</span>
    <span class="c"># Jsfiddle = &#34;xxxx&#34;</span>
    <span class="c"># Deviantart = &#34;xxxx&#34;</span>
    <span class="c"># Behance = &#34;xxxx&#34;</span>
    <span class="c"># Dribble = &#34;xxxx&#34;</span>
    <span class="c"># Wordpress = &#34;xxxx&#34;</span>
    <span class="c"># Vine = &#34;xxxx&#34;</span>
    <span class="c"># Googlescholar = &#34;xxxx&#34;</span>
    <span class="c"># Researchgate = &#34;xxxx&#34;</span>
    <span class="c"># Mastodon = &#34;xxxx&#34;</span>
    <span class="c"># MastodonPrefix = &#34;https://mastodon.technology/&#34;</span>
    <span class="c"># Thingiverse = &#34;xxxx&#34;</span>
    <span class="c"># Devto = &#34;xxxx&#34;</span>
    <span class="c"># Gitea = &#34;xxxx&#34;</span>
    <span class="c"># XMPP = &#34;xxxx&#34;</span>
    <span class="c"># Matrix = &#34;xxxx&#34;</span>
    <span class="c"># Bilibili = &#34;xxxx&#34;</span>

  <span class="c"># Page config</span>
  <span class="p">[</span><span class="nx">params</span><span class="p">.</span><span class="nx">page</span><span class="p">]</span>
    <span class="c"># whether to use lightgallery in the page</span>
    <span class="nx">lightgallery</span> <span class="p">=</span> <span class="kc">true</span>
    <span class="c"># whether to show link to Raw Markdown content of the post</span>
    <span class="nx">linkToMarkdown</span> <span class="p">=</span> <span class="kc">true</span>
  <span class="c"># mathematical formulas (KaTeX https://katex.org/)</span>
  <span class="p">[</span><span class="nx">params</span><span class="p">.</span><span class="nx">math</span><span class="p">]</span>
    <span class="nx">enable</span> <span class="p">=</span> <span class="kc">true</span>
    <span class="c"># default block delimiter is $$ ... $$ and \\[ ... \\]</span>
    <span class="nx">blockLeftDelimiter</span> <span class="p">=</span> <span class="s2">&#34;&#34;</span>
    <span class="nx">blockRightDelimiter</span> <span class="p">=</span> <span class="s2">&#34;&#34;</span>
    <span class="c"># default inline delimiter is $ ... $ and \\( ... \\)</span>
    <span class="nx">inlineLeftDelimiter</span> <span class="p">=</span> <span class="s2">&#34;&#34;</span>
    <span class="nx">inlineRightDelimiter</span> <span class="p">=</span> <span class="s2">&#34;&#34;</span>
    <span class="c"># KaTeX extension copy_tex</span>
    <span class="nx">copyTex</span> <span class="p">=</span> <span class="kc">true</span>
    <span class="c"># KaTeX extension mhchem</span>
    <span class="nx">mhchem</span> <span class="p">=</span> <span class="kc">true</span>
  <span class="c"># Social Share Links in post page</span>
  <span class="p">[</span><span class="nx">params</span><span class="p">.</span><span class="nx">share</span><span class="p">]</span>
    <span class="nx">enable</span> <span class="p">=</span> <span class="kc">true</span>
    <span class="nx">Twitter</span> <span class="p">=</span> <span class="kc">true</span>
    <span class="nx">Facebook</span> <span class="p">=</span> <span class="kc">true</span>
    <span class="nx">Linkedin</span> <span class="p">=</span> <span class="kc">true</span>
    <span class="nx">Whatsapp</span> <span class="p">=</span> <span class="kc">true</span>
    <span class="nx">Pinterest</span> <span class="p">=</span> <span class="kc">true</span>
    <span class="c"># Tumblr = true</span>
    <span class="nx">HackerNews</span> <span class="p">=</span> <span class="kc">true</span>
    <span class="c"># Reddit = true</span>
    <span class="c"># VK = true</span>
    <span class="c"># Buffer = true</span>
    <span class="c"># Xing = true</span>
    <span class="c"># Line = true</span>
    <span class="c"># Instapaper = true</span>
    <span class="c"># Pocket = true</span>
    <span class="c"># Digg = true</span>
    <span class="c"># Stumbleupon = true</span>
    <span class="c"># Flipboard = true</span>
    <span class="c"># Weibo = true</span>
    <span class="c"># Renren = true</span>
    <span class="c"># Myspace = true</span>
    <span class="c"># Blogger = true</span>
    <span class="c"># Baidu = true</span>
    <span class="c"># Odnoklassniki = true</span>
    <span class="c"># Evernote = true</span>
    <span class="c"># Skype = true</span>
    <span class="c"># Trello = true</span>
    <span class="c"># Mix = true</span>
  <span class="c"># Comment Config</span>
  <span class="p">[</span><span class="nx">params</span><span class="p">.</span><span class="nx">comment</span><span class="p">]</span>
    <span class="nx">enable</span> <span class="p">=</span> <span class="kc">true</span>
    <span class="c"># Disqus Comment Config (https://disqus.com/)</span>
    <span class="p">[</span><span class="nx">params</span><span class="p">.</span><span class="nx">comment</span><span class="p">.</span><span class="nx">disqus</span><span class="p">]</span>
      <span class="c"># LoveIt <i class="fas fa-greater-than-equal fa-fw"></i> <i class="far fa-file-archive fa-fw"></i> v0.1.1</span>
      <span class="nx">enable</span> <span class="p">=</span> <span class="kc">false</span>
      <span class="c"># Disqus shortname to use Disqus in posts</span>
      <span class="nx">shortname</span> <span class="p">=</span> <span class="s2">&#34;&#34;</span>
    <span class="c"># Gitalk Comment Config (https://github.com/gitalk/gitalk)</span>
    <span class="p">[</span><span class="nx">params</span><span class="p">.</span><span class="nx">comment</span><span class="p">.</span><span class="nx">gitalk</span><span class="p">]</span>
      <span class="c"># LoveIt <i class="fas fa-greater-than-equal fa-fw"></i> <i class="far fa-file-archive fa-fw"></i> v0.1.1</span>
      <span class="nx">enable</span> <span class="p">=</span> <span class="kc">false</span>
      <span class="nx">owner</span> <span class="p">=</span> <span class="s2">&#34;&#34;</span>
      <span class="nx">repo</span> <span class="p">=</span> <span class="s2">&#34;&#34;</span>
      <span class="nx">clientId</span> <span class="p">=</span> <span class="s2">&#34;&#34;</span>
      <span class="nx">clientSecret</span> <span class="p">=</span> <span class="s2">&#34;&#34;</span>
    <span class="c"># Valine Comment Config (https://github.com/xCss/Valine)</span>
    <span class="p">[</span><span class="nx">params</span><span class="p">.</span><span class="nx">comment</span><span class="p">.</span><span class="nx">valine</span><span class="p">]</span>
      <span class="nx">enable</span> <span class="p">=</span> <span class="kc">false</span>
      <span class="nx">appId</span> <span class="p">=</span> <span class="s2">&#34;&#34;</span>
      <span class="nx">appKey</span> <span class="p">=</span> <span class="s2">&#34;&#34;</span>
      <span class="nx">placeholder</span> <span class="p">=</span> <span class="s2">&#34;Your comment ...&#34;</span>
      <span class="nx">notify</span> <span class="p">=</span> <span class="kc">false</span>
      <span class="nx">verify</span> <span class="p">=</span> <span class="kc">true</span>
      <span class="nx">avatar</span> <span class="p">=</span> <span class="s2">&#34;mp&#34;</span>
      <span class="nx">meta</span><span class="p">=</span> <span class="s2">&#34;&#34;</span>
      <span class="nx">pageSize</span> <span class="p">=</span> <span class="mi">10</span>
      <span class="nx">lang</span> <span class="p">=</span> <span class="s2">&#34;en&#34;</span>
      <span class="nx">visitor</span> <span class="p">=</span> <span class="kc">true</span>
      <span class="nx">recordIP</span> <span class="p">=</span> <span class="kc">true</span>
    <span class="c"># Facebook Comment Config (https://developers.facebook.com/docs/plugins/comments)</span>
    <span class="p">[</span><span class="nx">params</span><span class="p">.</span><span class="nx">comment</span><span class="p">.</span><span class="nx">facebook</span><span class="p">]</span>
      <span class="nx">enable</span> <span class="p">=</span> <span class="kc">false</span>
      <span class="nx">width</span> <span class="p">=</span> <span class="s2">&#34;100%&#34;</span>
      <span class="nx">numPosts</span> <span class="p">=</span> <span class="mi">10</span>
      <span class="nx">appId</span> <span class="p">=</span> <span class="s2">&#34;&#34;</span>
      <span class="nx">languageCode</span> <span class="p">=</span> <span class="s2">&#34;en_US&#34;</span>

  <span class="c"># site verification code for Google/Bing/Yandex/Pinterest/Baidu</span>
  <span class="p">[</span><span class="nx">params</span><span class="p">.</span><span class="nx">verification</span><span class="p">]</span>
    <span class="nx">google</span> <span class="p">=</span> <span class="s2">&#34;&#34;</span>
    <span class="nx">bing</span> <span class="p">=</span> <span class="s2">&#34;&#34;</span>
    <span class="nx">yandex</span> <span class="p">=</span> <span class="s2">&#34;&#34;</span>
    <span class="nx">pinterest</span> <span class="p">=</span> <span class="s2">&#34;&#34;</span>
    <span class="nx">baidu</span> <span class="p">=</span> <span class="s2">&#34;&#34;</span>
  <span class="c"># Publisher Info just for SEO</span>
  <span class="p">[</span><span class="nx">params</span><span class="p">.</span><span class="nx">publisher</span><span class="p">]</span>
    <span class="nx">name</span> <span class="p">=</span> <span class="s2">&#34;xxxx&#34;</span>
    <span class="p">[</span><span class="nx">params</span><span class="p">.</span><span class="nx">publisher</span><span class="p">.</span><span class="nx">logo</span><span class="p">]</span>
      <span class="nx">url</span> <span class="p">=</span> <span class="s2">&#34;logo.png&#34;</span>
      <span class="nx">width</span> <span class="p">=</span> <span class="mi">127</span>
      <span class="nx">height</span> <span class="p">=</span> <span class="mi">40</span>
  <span class="c"># Website Log Info just for SEO</span>
  <span class="p">[</span><span class="nx">params</span><span class="p">.</span><span class="nx">logo</span><span class="p">]</span>
    <span class="nx">url</span> <span class="p">=</span> <span class="s2">&#34;logo.png&#34;</span>
    <span class="nx">width</span> <span class="p">=</span> <span class="mi">127</span>
    <span class="nx">height</span> <span class="p">=</span> <span class="mi">40</span>
  <span class="c"># Website Image Info just for SEO</span>
  <span class="p">[</span><span class="nx">params</span><span class="p">.</span><span class="nx">image</span><span class="p">]</span>
    <span class="nx">url</span> <span class="p">=</span> <span class="s2">&#34;cover.png&#34;</span>
    <span class="nx">width</span> <span class="p">=</span> <span class="mi">800</span>
    <span class="nx">height</span> <span class="p">=</span> <span class="mi">600</span>
  <span class="c"># CSS and JS Files CDN</span>
  <span class="p">[</span><span class="nx">params</span><span class="p">.</span><span class="nx">cdn</span><span class="p">]</span>
    <span class="c"># fontawesome-free@5.12.1 https://fontawesome.com/</span>
    <span class="nx">fontawesomeFreeCSS</span> <span class="p">=</span> <span class="s1">&#39;&#39;</span>
    <span class="c"># animate.css@3.7.2 https://github.com/daneden/animate.css</span>
    <span class="nx">animateCSS</span> <span class="p">=</span> <span class="s1">&#39;&#39;</span>
    <span class="c"># smooth-scroll@16.1.2 https://github.com/cferdinandi/smooth-scroll</span>
    <span class="nx">smoothScrollJS</span> <span class="p">=</span> <span class="s1">&#39;&#39;</span>
    <span class="c"># sharer@0.4.0 https://github.com/ellisonleao/sharer.js</span>
    <span class="nx">sharerJS</span> <span class="p">=</span> <span class="s1">&#39;&#39;</span>
    <span class="c"># lazysizes@5.2.0 https://github.com/aFarkas/lazysizes</span>
    <span class="nx">lazysizesJS</span> <span class="p">=</span> <span class="s1">&#39;&#39;</span>
    <span class="c"># lightgallery@1.1.3 lg-thumbnail@1.1.0 lg-zoom@1.1.0 https://github.com/sachinchoolur/lightgallery.js</span>
    <span class="nx">lightgalleryCSS</span> <span class="p">=</span> <span class="s1">&#39;&#39;</span>
    <span class="nx">lightgalleryJS</span> <span class="p">=</span> <span class="s1">&#39;&#39;</span>
    <span class="nx">lightgalleryThumbnailJS</span> <span class="p">=</span> <span class="s1">&#39;&#39;</span>
    <span class="nx">lightgalleryZoomJS</span> <span class="p">=</span> <span class="s1">&#39;&#39;</span>
    <span class="c"># typeit@6.5.1 https://github.com/alexmacarthur/typeit</span>
    <span class="nx">typeitJS</span> <span class="p">=</span> <span class="s1">&#39;&#39;</span>
    <span class="c"># katex@0.11.1 https://github.com/KaTeX/KaTeX</span>
    <span class="nx">katexCSS</span> <span class="p">=</span> <span class="s1">&#39;&#39;</span>
    <span class="nx">katexJS</span> <span class="p">=</span> <span class="s1">&#39;&#39;</span>
    <span class="nx">katexAutoRenderJS</span> <span class="p">=</span> <span class="s1">&#39;&#39;</span>
    <span class="nx">katexCopyTexCSS</span> <span class="p">=</span> <span class="s1">&#39;&#39;</span>
    <span class="nx">katexCopyTexJS</span> <span class="p">=</span> <span class="s1">&#39;&#39;</span>
    <span class="nx">katexMhchemJS</span> <span class="p">=</span> <span class="s1">&#39;&#39;</span>
    <span class="c"># mermaid@8.4.8 https://github.com/knsv/mermaid</span>
    <span class="nx">mermaidJS</span> <span class="p">=</span> <span class="s1">&#39;&#39;</span>
    <span class="c"># aplayer@1.10.1 https://github.com/MoePlayer/APlayer</span>
    <span class="nx">aplayerCSS</span> <span class="p">=</span> <span class="s1">&#39;&#39;</span>
    <span class="nx">aplayerJS</span> <span class="p">=</span> <span class="s1">&#39;&#39;</span>
    <span class="c"># meting@2.0.1 https://github.com/metowolf/MetingJS</span>
    <span class="nx">metingJS</span> <span class="p">=</span> <span class="s1">&#39;&#39;</span>
    <span class="c"># echarts@4.6.0 https://echarts.apache.org/</span>
    <span class="nx">echartsJS</span> <span class="p">=</span> <span class="s1">&#39;&#39;</span>
    <span class="nx">echartsMacaronsJS</span> <span class="p">=</span> <span class="s1">&#39;&#39;</span>
    <span class="c"># gitalk@1.6.2 https://github.com/gitalk/gitalk</span>
    <span class="nx">gitalkCSS</span> <span class="p">=</span> <span class="s1">&#39;&#39;</span>
    <span class="nx">gitalkJS</span> <span class="p">=</span> <span class="s1">&#39;&#39;</span>
    <span class="c"># valine@1.3.10 https://valine.js.org/</span>
    <span class="nx">valineJS</span> <span class="p">=</span> <span class="s1">&#39;&#39;</span>

<span class="c"># Markup related configuration in Hugo</span>
<span class="p">[</span><span class="nx">markup</span><span class="p">]</span>
  <span class="c"># Syntax Highlighting (https://gohugo.io/content-management/syntax-highlighting)</span>
  <span class="p">[</span><span class="nx">markup</span><span class="p">.</span><span class="nx">highlight</span><span class="p">]</span>
    <span class="nx">codeFences</span> <span class="p">=</span> <span class="kc">true</span>
    <span class="nx">guessSyntax</span> <span class="p">=</span> <span class="kc">true</span>
    <span class="nx">lineNoStart</span> <span class="p">=</span> <span class="mi">1</span>
    <span class="nx">lineNos</span> <span class="p">=</span> <span class="kc">true</span>
    <span class="nx">lineNumbersInTable</span> <span class="p">=</span> <span class="kc">true</span>
    <span class="nx">noClasses</span> <span class="p">=</span> <span class="kc">false</span>
    <span class="nx">style</span> <span class="p">=</span> <span class="s2">&#34;monokai&#34;</span>
    <span class="nx">tabWidth</span> <span class="p">=</span> <span class="mi">4</span>
  <span class="c"># Goldmark is from Hugo 0.60 the default library used for Markdown</span>
  <span class="p">[</span><span class="nx">markup</span><span class="p">.</span><span class="nx">goldmark</span><span class="p">]</span>
    <span class="p">[</span><span class="nx">markup</span><span class="p">.</span><span class="nx">goldmark</span><span class="p">.</span><span class="nx">extensions</span><span class="p">]</span>
      <span class="nx">definitionList</span> <span class="p">=</span> <span class="kc">true</span>
      <span class="nx">footnote</span> <span class="p">=</span> <span class="kc">true</span>
      <span class="nx">linkify</span> <span class="p">=</span> <span class="kc">true</span>
      <span class="nx">strikethrough</span> <span class="p">=</span> <span class="kc">true</span>
      <span class="nx">table</span> <span class="p">=</span> <span class="kc">true</span>
      <span class="nx">taskList</span> <span class="p">=</span> <span class="kc">true</span>
      <span class="nx">typographer</span> <span class="p">=</span> <span class="kc">true</span>
    <span class="p">[</span><span class="nx">markup</span><span class="p">.</span><span class="nx">goldmark</span><span class="p">.</span><span class="nx">renderer</span><span class="p">]</span>
      <span class="c"># whether to use HTML tags directly in the document</span>
      <span class="nx">unsafe</span> <span class="p">=</span> <span class="kc">true</span>
  <span class="c"># Table Of Contents settings</span>
  <span class="p">[</span><span class="nx">markup</span><span class="p">.</span><span class="nx">tableOfContents</span><span class="p">]</span>
    <span class="nx">startLevel</span> <span class="p">=</span> <span class="mi">2</span>
    <span class="nx">endLevel</span> <span class="p">=</span> <span class="mi">6</span>

<span class="c"># Author Info</span>
<span class="p">[</span><span class="nx">author</span><span class="p">]</span>
  <span class="nx">name</span> <span class="p">=</span> <span class="s2">&#34;xxxx&#34;</span>
  <span class="nx">link</span> <span class="p">=</span> <span class="s2">&#34;&#34;</span>

<span class="c"># Sitemap Info</span>
<span class="p">[</span><span class="nx">sitemap</span><span class="p">]</span>
  <span class="nx">changefreq</span> <span class="p">=</span> <span class="s2">&#34;weekly&#34;</span>
  <span class="nx">filename</span> <span class="p">=</span> <span class="s2">&#34;sitemap.xml&#34;</span>
  <span class="nx">priority</span> <span class="p">=</span> <span class="mf">0.5</span>

<span class="c"># Permalinks Info (https://gohugo.io/content-management/urls/#permalinks)</span>
<span class="p">[</span><span class="nx">Permalinks</span><span class="p">]</span>
  <span class="c"># posts = &#34;:year/:month/:filename&#34;</span>
  <span class="nx">posts</span> <span class="p">=</span> <span class="s2">&#34;:filename&#34;</span>

<span class="c"># Privacy Info (https://gohugo.io/about/hugo-and-gdpr/)</span>
<span class="p">[</span><span class="nx">privacy</span><span class="p">]</span>
  <span class="p">[</span><span class="nx">privacy</span><span class="p">.</span><span class="nx">googleAnalytics</span><span class="p">]</span>
    <span class="nx">anonymizeIP</span> <span class="p">=</span> <span class="kc">true</span>

  <span class="p">[</span><span class="nx">privacy</span><span class="p">.</span><span class="nx">youtube</span><span class="p">]</span>
    <span class="nx">privacyEnhanced</span> <span class="p">=</span> <span class="kc">true</span>

<span class="c"># Options to make output .md files</span>
<span class="p">[</span><span class="nx">mediaTypes</span><span class="p">]</span>
  <span class="p">[</span><span class="nx">mediaTypes</span><span class="p">.</span><span class="s2">&#34;text/plain&#34;</span><span class="p">]</span>
    <span class="nx">suffixes</span> <span class="p">=</span> <span class="p">[</span><span class="s2">&#34;md&#34;</span><span class="p">]</span>

<span class="c"># Options to make output .md files</span>
<span class="p">[</span><span class="nx">outputFormats</span><span class="p">.</span><span class="nx">MarkDown</span><span class="p">]</span>
  <span class="nx">mediaType</span> <span class="p">=</span> <span class="s2">&#34;text/plain&#34;</span>
  <span class="nx">isPlainText</span> <span class="p">=</span> <span class="kc">true</span>
  <span class="nx">isHTML</span> <span class="p">=</span> <span class="kc">false</span>

<span class="c"># Options to make hugo output files</span>
<span class="p">[</span><span class="nx">outputs</span><span class="p">]</span>
  <span class="nx">home</span> <span class="p">=</span> <span class="p">[</span><span class="s2">&#34;HTML&#34;</span><span class="p">,</span> <span class="s2">&#34;RSS&#34;</span><span class="p">]</span>
  <span class="nx">page</span> <span class="p">=</span> <span class="p">[</span><span class="s2">&#34;HTML&#34;</span><span class="p">,</span> <span class="s2">&#34;MarkDown&#34;</span><span class="p">]</span>
  <span class="nx">section</span> <span class="p">=</span> <span class="p">[</span><span class="s2">&#34;HTML&#34;</span><span class="p">,</span> <span class="s2">&#34;RSS&#34;</span><span class="p">]</span>
  <span class="nx">taxonomy</span> <span class="p">=</span> <span class="p">[</span><span class="s2">&#34;HTML&#34;</span><span class="p">,</span> <span class="s2">&#34;RSS&#34;</span><span class="p">]</span>
  <span class="nx">taxonomyTerm</span> <span class="p">=</span> <span class="p">[</span><span class="s2">&#34;HTML&#34;</span><span class="p">]</span>
</code></pre></td></tr></table>
</div>
</div><p><figure><a class="lightgallery" href="https://ainy.gitee.io/images/theme-documentation-basics/complete-configuration-preview.png" title="Complete configuration preview" data-thumbnail="/images/theme-documentation-basics/complete-configuration-preview.png" data-sub-html="<h2>Complete configuration preview</h2><p>Complete configuration preview</p>">
        <img
            class="lazyload"
            src="https://ainy.gitee.io/svg/loading.min.svg"
            data-sizes="auto"
            data-srcset="https://ainy.gitee.io/images/theme-documentation-basics/complete-configuration-preview.png, https://ainy.gitee.io/images/theme-documentation-basics/complete-configuration-preview.png 1.5x, https://ainy.gitee.io/images/theme-documentation-basics/complete-configuration-preview.png 2x"
            data-src="https://ainy.gitee.io/images/theme-documentation-basics/complete-configuration-preview.png"
            alt="Complete configuration preview" />
    </a><figcaption class="image-caption">Complete configuration preview</figcaption>
    </figure></p>
<h3 id="32-favicons-browserconfig-manifest">3.2 Favicons, Browserconfig, Manifest</h3>
<p>It is recommended to put your own favicons:</p>
<ul>
<li>apple-touch-icon.png (180x180)</li>
<li>favicon-32x32.png (32x32)</li>
<li>favicon-16x16.png (16x16)</li>
<li>mstile-150x150.png (150x150)</li>
<li>android-chrome-192x192.png (192x192)</li>
<li>android-chrome-512x512.png (512x512)</li>
</ul>
<p>into <code>/static</code>. They’re easily created via <a href="https://realfavicongenerator.net/" target="_blank" rel="noopener noreffer">https://realfavicongenerator.net/</a>
.</p>
<p>Customize <code>browserconfig.xml</code> and <code>site.webmanifest</code> to set theme-color and background-color.</p>
<h3 id="33-add-logo-and-cover-for-seo">3.3 Add Logo and Cover for SEO</h3>
<p>Add a logo image (127x40) and a cover image (800x600) in the <code>static</code> directory.</p>
<h3 id="34-style-customization">3.4 Style Customization</h3>
<p><strong>LoveIt</strong> theme has been built to be as configurable as possible by defining custom <code>.scss</code> style files.</p>
<p>The directory including the custom <code>.scss</code> style files is <code>config/css</code> relative to <strong>your project root directory</strong>.</p>
<p>In <code>config/css/_override.scss</code>, you can override the variables in <code>themes/LoveIt/assets/css/_variables.scss</code> to customize the style.</p>
<p>Here is a example:</p>
<div class="highlight"><div class="chroma">
<table class="lntable"><tr><td class="lntd">
<pre class="chroma"><code><span class="lnt">1
</span><span class="lnt">2
</span></code></pre></td>
<td class="lntd">
<pre class="chroma"><code class="language-scss" data-lang="scss"><span class="k">@import</span> <span class="sx">url(&#39;https://fonts.googleapis.com/css?family=Fira+Mono:400,700&amp;display=swap&amp;subset=latin-ext&#39;)</span><span class="p">;</span>
<span class="nv">$code-font-family</span><span class="o">:</span> <span class="n">Fira</span> <span class="n">Mono</span><span class="o">,</span> <span class="n">Source</span> <span class="n">Code</span> <span class="n">Pro</span><span class="o">,</span> <span class="n">Menlo</span><span class="o">,</span> <span class="n">Consolas</span><span class="o">,</span> <span class="n">Monaco</span><span class="o">,</span> <span class="no">monospace</span><span class="p">;</span>
</code></pre></td></tr></table>
</div>
</div><p>In <code>config/css/_custom.scss</code>, you can add some css style code to customize the style.</p>
<h2 id="4-multilingual-and-i18n">4 Multilingual and i18n</h2>
<p><strong>LoveIt</strong> theme is fully compatible with Hugo multilingual mode.</p>
<p>It provides:</p>
<ul>
<li>Translation strings for default values (<strong>English</strong>, <strong>Chinese</strong> and <strong>French</strong>). <strong>Feel free to contribute!</strong></li>
<li>In-browser language switching</li>
</ul>
<p><figure><a class="lightgallery" href="https://ainy.gitee.io/images/theme-documentation-basics/language-switch.gif" title="Language Switch" data-thumbnail="/images/theme-documentation-basics/language-switch.gif" data-sub-html="<h2>Language Switch</h2><p>Language Switch</p>">
        <img
            class="lazyload"
            src="https://ainy.gitee.io/svg/loading.min.svg"
            data-sizes="auto"
            data-srcset="https://ainy.gitee.io/images/theme-documentation-basics/language-switch.gif, https://ainy.gitee.io/images/theme-documentation-basics/language-switch.gif 1.5x, https://ainy.gitee.io/images/theme-documentation-basics/language-switch.gif 2x"
            data-src="https://ainy.gitee.io/images/theme-documentation-basics/language-switch.gif"
            alt="Language Switch" />
    </a><figcaption class="image-caption">Language Switch</figcaption>
    </figure></p>
<h3 id="41-basic-configuration">4.1 Basic Configuration</h3>
<p>After learning <a href="https://gohugo.io/content-management/multilingual" target="_blank" rel="noopener noreffer">how Hugo handle multilingual websites</a>
, define your languages in your <a href="#site-configuration" rel="noopener noreffer">site configuration</a>
.</p>
<p>For example with English, Chinese and French website:</p>
<div class="highlight"><div class="chroma">
<table class="lntable"><tr><td class="lntd">
<pre class="chroma"><code><span class="lnt"> 1
</span><span class="lnt"> 2
</span><span class="lnt"> 3
</span><span class="lnt"> 4
</span><span class="lnt"> 5
</span><span class="lnt"> 6
</span><span class="lnt"> 7
</span><span class="lnt"> 8
</span><span class="lnt"> 9
</span><span class="lnt">10
</span><span class="lnt">11
</span><span class="lnt">12
</span><span class="lnt">13
</span><span class="lnt">14
</span><span class="lnt">15
</span><span class="lnt">16
</span><span class="lnt">17
</span><span class="lnt">18
</span><span class="lnt">19
</span><span class="lnt">20
</span><span class="lnt">21
</span><span class="lnt">22
</span><span class="lnt">23
</span><span class="lnt">24
</span><span class="lnt">25
</span><span class="lnt">26
</span><span class="lnt">27
</span><span class="lnt">28
</span><span class="lnt">29
</span><span class="lnt">30
</span><span class="lnt">31
</span><span class="lnt">32
</span><span class="lnt">33
</span><span class="lnt">34
</span><span class="lnt">35
</span><span class="lnt">36
</span><span class="lnt">37
</span><span class="lnt">38
</span><span class="lnt">39
</span><span class="lnt">40
</span><span class="lnt">41
</span><span class="lnt">42
</span><span class="lnt">43
</span><span class="lnt">44
</span><span class="lnt">45
</span><span class="lnt">46
</span><span class="lnt">47
</span><span class="lnt">48
</span><span class="lnt">49
</span><span class="lnt">50
</span><span class="lnt">51
</span><span class="lnt">52
</span><span class="lnt">53
</span><span class="lnt">54
</span><span class="lnt">55
</span><span class="lnt">56
</span><span class="lnt">57
</span><span class="lnt">58
</span><span class="lnt">59
</span><span class="lnt">60
</span><span class="lnt">61
</span><span class="lnt">62
</span><span class="lnt">63
</span><span class="lnt">64
</span><span class="lnt">65
</span><span class="lnt">66
</span><span class="lnt">67
</span><span class="lnt">68
</span><span class="lnt">69
</span><span class="lnt">70
</span><span class="lnt">71
</span><span class="lnt">72
</span><span class="lnt">73
</span><span class="lnt">74
</span><span class="lnt">75
</span><span class="lnt">76
</span><span class="lnt">77
</span><span class="lnt">78
</span><span class="lnt">79
</span><span class="lnt">80
</span><span class="lnt">81
</span><span class="lnt">82
</span><span class="lnt">83
</span><span class="lnt">84
</span><span class="lnt">85
</span><span class="lnt">86
</span><span class="lnt">87
</span></code></pre></td>
<td class="lntd">
<pre class="chroma"><code class="language-toml" data-lang="toml"><span class="c"># [en, zh-cn, fr, ...] determines default content language</span>
<span class="nx">defaultContentLanguage</span> <span class="p">=</span> <span class="s2">&#34;en&#34;</span>

<span class="p">[</span><span class="nx">languages</span><span class="p">]</span>
  <span class="p">[</span><span class="nx">languages</span><span class="p">.</span><span class="nx">en</span><span class="p">]</span>
    <span class="nx">weight</span> <span class="p">=</span> <span class="mi">1</span>
    <span class="nx">title</span> <span class="p">=</span> <span class="s2">&#34;My New Hugo Site&#34;</span>
    <span class="nx">languageCode</span> <span class="p">=</span> <span class="s2">&#34;en&#34;</span>
    <span class="nx">languageName</span> <span class="p">=</span> <span class="s2">&#34;English&#34;</span>
    <span class="p">[[</span><span class="nx">languages</span><span class="p">.</span><span class="nx">en</span><span class="p">.</span><span class="nx">menu</span><span class="p">.</span><span class="nx">main</span><span class="p">]]</span>
      <span class="nx">identifier</span> <span class="p">=</span> <span class="s2">&#34;posts&#34;</span>
      <span class="nx">pre</span> <span class="p">=</span> <span class="s2">&#34;&#34;</span>
      <span class="nx">name</span> <span class="p">=</span> <span class="s2">&#34;Posts&#34;</span>
      <span class="nx">url</span> <span class="p">=</span> <span class="s2">&#34;/posts/&#34;</span>
      <span class="nx">title</span> <span class="p">=</span> <span class="s2">&#34;&#34;</span>
      <span class="nx">weight</span> <span class="p">=</span> <span class="mi">1</span>
    <span class="p">[[</span><span class="nx">languages</span><span class="p">.</span><span class="nx">en</span><span class="p">.</span><span class="nx">menu</span><span class="p">.</span><span class="nx">main</span><span class="p">]]</span>
      <span class="nx">identifier</span> <span class="p">=</span> <span class="s2">&#34;tags&#34;</span>
      <span class="nx">pre</span> <span class="p">=</span> <span class="s2">&#34;&#34;</span>
      <span class="nx">name</span> <span class="p">=</span> <span class="s2">&#34;Tags&#34;</span>
      <span class="nx">url</span> <span class="p">=</span> <span class="s2">&#34;/tags/&#34;</span>
      <span class="nx">title</span> <span class="p">=</span> <span class="s2">&#34;&#34;</span>
      <span class="nx">weight</span> <span class="p">=</span> <span class="mi">2</span>
    <span class="p">[[</span><span class="nx">languages</span><span class="p">.</span><span class="nx">en</span><span class="p">.</span><span class="nx">menu</span><span class="p">.</span><span class="nx">main</span><span class="p">]]</span>
      <span class="nx">identifier</span> <span class="p">=</span> <span class="s2">&#34;categories&#34;</span>
      <span class="nx">pre</span> <span class="p">=</span> <span class="s2">&#34;&#34;</span>
      <span class="nx">name</span> <span class="p">=</span> <span class="s2">&#34;Categories&#34;</span>
      <span class="nx">url</span> <span class="p">=</span> <span class="s2">&#34;/categories/&#34;</span>
      <span class="nx">title</span> <span class="p">=</span> <span class="s2">&#34;&#34;</span>
      <span class="nx">weight</span> <span class="p">=</span> <span class="mi">3</span>

  <span class="p">[</span><span class="nx">languages</span><span class="p">.</span><span class="nx">zh</span><span class="err">-</span><span class="nx">cn</span><span class="p">]</span>
    <span class="nx">weight</span> <span class="p">=</span> <span class="mi">2</span>
    <span class="nx">title</span> <span class="p">=</span> <span class="s2">&#34;我的全新 Hugo 网站&#34;</span>
    <span class="c"># language code, CN only here</span>
    <span class="nx">languageCode</span> <span class="p">=</span> <span class="s2">&#34;zh-CN&#34;</span>
    <span class="nx">languageName</span> <span class="p">=</span> <span class="s2">&#34;简体中文&#34;</span>
    <span class="c"># whether to include Chinese/Japanese/Korean</span>
    <span class="nx">hasCJKLanguage</span> <span class="p">=</span> <span class="kc">true</span>
    <span class="p">[[</span><span class="nx">languages</span><span class="p">.</span><span class="nx">zh</span><span class="err">-</span><span class="nx">cn</span><span class="p">.</span><span class="nx">menu</span><span class="p">.</span><span class="nx">main</span><span class="p">]]</span>
      <span class="nx">identifier</span> <span class="p">=</span> <span class="s2">&#34;posts&#34;</span>
      <span class="nx">pre</span> <span class="p">=</span> <span class="s2">&#34;&#34;</span>
      <span class="nx">name</span> <span class="p">=</span> <span class="s2">&#34;文章&#34;</span>
      <span class="nx">url</span> <span class="p">=</span> <span class="s2">&#34;/posts/&#34;</span>
      <span class="nx">title</span> <span class="p">=</span> <span class="s2">&#34;&#34;</span>
      <span class="nx">weight</span> <span class="p">=</span> <span class="mi">1</span>
    <span class="p">[[</span><span class="nx">languages</span><span class="p">.</span><span class="nx">zh</span><span class="err">-</span><span class="nx">cn</span><span class="p">.</span><span class="nx">menu</span><span class="p">.</span><span class="nx">main</span><span class="p">]]</span>
      <span class="nx">identifier</span> <span class="p">=</span> <span class="s2">&#34;tags&#34;</span>
      <span class="nx">pre</span> <span class="p">=</span> <span class="s2">&#34;&#34;</span>
      <span class="nx">name</span> <span class="p">=</span> <span class="s2">&#34;标签&#34;</span>
      <span class="nx">url</span> <span class="p">=</span> <span class="s2">&#34;/tags/&#34;</span>
      <span class="nx">title</span> <span class="p">=</span> <span class="s2">&#34;&#34;</span>
      <span class="nx">weight</span> <span class="p">=</span> <span class="mi">2</span>
    <span class="p">[[</span><span class="nx">languages</span><span class="p">.</span><span class="nx">zh</span><span class="err">-</span><span class="nx">cn</span><span class="p">.</span><span class="nx">menu</span><span class="p">.</span><span class="nx">main</span><span class="p">]]</span>
      <span class="nx">identifier</span> <span class="p">=</span> <span class="s2">&#34;categories&#34;</span>
      <span class="nx">pre</span> <span class="p">=</span> <span class="s2">&#34;&#34;</span>
      <span class="nx">name</span> <span class="p">=</span> <span class="s2">&#34;分类&#34;</span>
      <span class="nx">url</span> <span class="p">=</span> <span class="s2">&#34;/categories/&#34;</span>
      <span class="nx">title</span> <span class="p">=</span> <span class="s2">&#34;&#34;</span>
      <span class="nx">weight</span> <span class="p">=</span> <span class="mi">3</span>

  <span class="p">[</span><span class="nx">languages</span><span class="p">.</span><span class="nx">fr</span><span class="p">]</span>
    <span class="nx">weight</span> <span class="p">=</span> <span class="mi">3</span>
    <span class="nx">title</span> <span class="p">=</span> <span class="s2">&#34;Mon nouveau site Hugo&#34;</span>
    <span class="nx">languageCode</span> <span class="p">=</span> <span class="s2">&#34;fr&#34;</span>
    <span class="nx">languageName</span> <span class="p">=</span> <span class="s2">&#34;Français&#34;</span>
    <span class="p">[[</span><span class="nx">languages</span><span class="p">.</span><span class="nx">fr</span><span class="p">.</span><span class="nx">menu</span><span class="p">.</span><span class="nx">main</span><span class="p">]]</span>
      <span class="nx">identifier</span> <span class="p">=</span> <span class="s2">&#34;posts&#34;</span>
      <span class="nx">pre</span> <span class="p">=</span> <span class="s2">&#34;&#34;</span>
      <span class="nx">name</span> <span class="p">=</span> <span class="s2">&#34;Postes&#34;</span>
      <span class="nx">url</span> <span class="p">=</span> <span class="s2">&#34;/posts/&#34;</span>
      <span class="nx">title</span> <span class="p">=</span> <span class="s2">&#34;&#34;</span>
      <span class="nx">weight</span> <span class="p">=</span> <span class="mi">1</span>
    <span class="p">[[</span><span class="nx">languages</span><span class="p">.</span><span class="nx">fr</span><span class="p">.</span><span class="nx">menu</span><span class="p">.</span><span class="nx">main</span><span class="p">]]</span>
      <span class="nx">identifier</span> <span class="p">=</span> <span class="s2">&#34;tags&#34;</span>
      <span class="nx">pre</span> <span class="p">=</span> <span class="s2">&#34;&#34;</span>
      <span class="nx">name</span> <span class="p">=</span> <span class="s2">&#34;Balises&#34;</span>
      <span class="nx">url</span> <span class="p">=</span> <span class="s2">&#34;/tags/&#34;</span>
      <span class="nx">title</span> <span class="p">=</span> <span class="s2">&#34;&#34;</span>
      <span class="nx">weight</span> <span class="p">=</span> <span class="mi">2</span>
    <span class="p">[[</span><span class="nx">languages</span><span class="p">.</span><span class="nx">fr</span><span class="p">.</span><span class="nx">menu</span><span class="p">.</span><span class="nx">main</span><span class="p">]]</span>
      <span class="nx">identifier</span> <span class="p">=</span> <span class="s2">&#34;categories&#34;</span>
      <span class="nx">name</span> <span class="p">=</span> <span class="s2">&#34;Catégories&#34;</span>
      <span class="nx">pre</span> <span class="p">=</span> <span class="s2">&#34;&#34;</span>
      <span class="nx">url</span> <span class="p">=</span> <span class="s2">&#34;/categories/&#34;</span>
      <span class="nx">title</span> <span class="p">=</span> <span class="s2">&#34;&#34;</span>
      <span class="nx">weight</span> <span class="p">=</span> <span class="mi">3</span>
</code></pre></td></tr></table>
</div>
</div><p>Then, for each new page, append the language code to the file name.</p>
<p>Single file <code>my-page.md</code> is split in three files:</p>
<ul>
<li>in English: <code>my-page.en.md</code></li>
<li>in Chinese: <code>my-page.zh-cn.md</code></li>
<li>in French: <code>my-page.fr.md</code></li>
</ul>
<div class="admonition note">
            <p class="admonition-title"><i class="icon fas fa-pencil-alt"></i>Note</p>
            <div class="admonition-content">Be aware that only translated pages are displayed in menu. It’s not replaced with default language content.</div>
        </div>
<div class="admonition tip">
            <p class="admonition-title"><i class="icon fas fa-lightbulb"></i>Tip</p>
            <div class="admonition-content">Use <a href="https://gohugo.io/content-management/multilingual/#translate-your-content" target="_blank" rel="noopener noreffer">Front Matter parameter</a>
 to translate urls too.</div>
        </div>
<h3 id="42-overwrite-translation-strings">4.2 Overwrite Translation Strings</h3>
<p>Translations strings are used for common default values used in the theme. Translations are available in <strong>English</strong>, <strong>Chinese</strong> and <strong>French</strong>, but you may use another language or want to override default values.</p>
<p>To override these values, create a new file in your local i18n folder <code>i18n/&lt;languageCode&gt;.toml</code> and inspire yourself from <code>themes/LoveIt/i18n/en.toml</code>.</p>
<p>By the way, as these translations could be used by other people, please take the time to propose a translation by <a href="https://github.com/dillonzq/LoveIt/pulls" target="_blank" rel="noopener noreffer">making a PR</a>
 to the theme!</p></div><div class="post-footer" id="post-footer">
    <div class="post-info">
        <div class="post-info-line">
            <div class="post-info-mod">
                <span>The article was updated on 2020-04-19&nbsp;<a class="git-hash" href="https://gitee.com/ainy/ainy/commit/25d5237ea4c355053ecefd674a1ad9ea86b49efe" target="_blank" title="commit by Jie(maybe_happy@163.com) 25d5237ea4c355053ecefd674a1ad9ea86b49efe: init the blog">
                            <i class="fas fa-hashtag fa-fw"></i>25d5237</a></span>
            </div>
            <div class="post-info-license"></div>
        </div>
        <div class="post-info-line">
            <div class="post-info-md"></div>
            <div class="post-info-share">
                <span><a href="javascript:void(0);" title="Share on Twitter" data-sharer="twitter" data-url="https://ainy.gitee.io/en/theme-documentation-basics/" data-title="Theme Documentation - Basics" data-via="xxxx" data-hashtags="installation,configuration"><i class="fab fa-twitter fa-fw"></i></a><a href="javascript:void(0);" title="Share on Facebook" data-sharer="facebook" data-url="https://ainy.gitee.io/en/theme-documentation-basics/" data-hashtag="installation"><i class="fab fa-facebook-square fa-fw"></i></a><a href="javascript:void(0);" title="Share on Linkedin" data-sharer="linkedin" data-url="https://ainy.gitee.io/en/theme-documentation-basics/"><i class="fab fa-linkedin fa-fw"></i></a><a href="javascript:void(0);" title="Share on WhatsApp" data-sharer="whatsapp" data-url="https://ainy.gitee.io/en/theme-documentation-basics/" data-title="Theme Documentation - Basics" data-web><i class="fab fa-whatsapp fa-fw"></i></a><a href="javascript:void(0);" title="Share on Pinterest" data-sharer="pinterest" data-url="https://ainy.gitee.io/en/theme-documentation-basics/" data-description="Discover what the Hugo - LoveIt theme is all about and the core-concepts behind it." data-image="/images/theme-documentation-basics/featured-image.jpg"><i class="fab fa-pinterest fa-fw"></i></a><a href="javascript:void(0);" title="Share on Hacker News" data-sharer="hackernews" data-url="https://ainy.gitee.io/en/theme-documentation-basics/" data-title="Theme Documentation - Basics"><i class="fab fa-hacker-news fa-fw"></i></a></span>
            </div>
        </div>
    </div>

    <div class="post-info-more">
        <section><i class="fas fa-tags fa-fw"></i>&nbsp;<a href="https://ainy.gitee.io/en/tags/installation">installation</a>,&nbsp;<a href="https://ainy.gitee.io/en/tags/configuration">configuration</a></section>
        <section>
            <span><a href="javascript:window.history.back();">Back</a></span>&nbsp;|&nbsp;<span><a href="https://ainy.gitee.io/en/">Home</a></span>
        </section>
    </div>

    <div class="post-nav"><a href="https://ainy.gitee.io/en/theme-documentation-content/" class="prev" rel="prev" title="Theme Documentation - Content"><i class="fas fa-angle-left fa-fw"></i>Theme Documentation - Content</a></div>
</div>
<div class="comment"><div id="valine"></div><script>
            document.addEventListener("DOMContentLoaded", function(event) {
                new Valine({
                    el: '#valine',
                    appId: 'QGzwQXOqs5JOhN4RGPOkR2mR-MdYXbMMI',
                    appKey: 'WBmoGyJtbqUswvfLh6L8iEBr',placeholder: 'Your comment ...',verify: true,avatar: 'mp',pageSize: 10,lang: 'en',visitor: true,recordIP: true,});
            });
        </script>
        <noscript>
            Please enable JavaScript to view the <a href="https://valine.js.org/">comments powered by Valine.</a>
        </noscript></div>
    </article></div>
            </main><footer class="footer">
    <div class="copyright"><div class="copyright-line">Powered by <a href="https://gohugo.io/" target="_blank" rel="external nofollow noopener noreffer">Hugo</a> | Theme - <a href="https://github.com/dillonzq/LoveIt" target="_blank" rel="external nofollow noopener noreffer"><i class="far fa-heart fa-fw"></i> LoveIt</a>
        </div>

        <div class="copyright-line"><i class="far fa-copyright fa-fw"></i><span itemprop="copyrightYear">2019 - 2020</span><span class="author" itemprop="copyrightHolder">&nbsp;<a href="https://ainy.gitee.io/en/" target="_blank">Jie</a></span>&nbsp;|&nbsp;<span class="license"><a rel="license external nofollow noopener noreffer" href="https://creativecommons.org/licenses/by-nc/4.0/" target="_blank">CC BY-NC 4.0</a></span></div>
    </div>
</footer>
</div><a href="#" class="dynamic-to-top animated faster" id="dynamic-to-top">
            <i class="fas fa-chevron-up fa-fw"></i>
        </a><script>
        document.addEventListener('DOMContentLoaded', function () {
            lightGallery(document.getElementById('content'), {
                selector: '.lightgallery',
                speed: 400,
                hideBarsDelay: 2000,
                thumbnail: true,
                exThumbImage: 'data-thumbnail',
                thumbWidth: 80,
                thumbContHeight: 80,
            });
        });
    </script><link rel="stylesheet" href="https://ainy.gitee.io/lib/valine/valine.css"><link rel="stylesheet" href="https://ainy.gitee.io/lib/lightgallery/lightgallery.min.css"><script src="https://ainy.gitee.io/lib/valine/Valine.min.js"></script><script src="https://ainy.gitee.io/lib/smooth-scroll/smooth-scroll.polyfills.min.js"></script><script src="https://ainy.gitee.io/lib/sharer/sharer.min.js"></script><script src="https://ainy.gitee.io/lib/lazysizes/lazysizes.min.js"></script><script src="https://ainy.gitee.io/lib/lightgallery/lightgallery.min.js"></script><script src="https://ainy.gitee.io/lib/lightgallery/lg-thumbnail.min.js"></script><script src="https://ainy.gitee.io/lib/lightgallery/lg-zoom.min.js"></script><script src="https://ainy.gitee.io/js/theme.min.js"></script></body>
</html>
